@import "../../style/const.scss";

@media only screen and (max-width: 767px) {
    .dt-theme-filter {
        display: none;
    }
}

@media only screen and (min-width: 767px) {
    .dt-theme-filter {
        width: calc(100% - 24px);
        margin: 0 12px;
        height: 40px;
        padding: 16px;
        color: #30363F;
        font-size: 14px;
        border: 1px solid #D0D5D8;
        border-radius: 20px;
        outline: none;
        transition: all 0.3s;
        background-color: transparent;
    }
    .dumi-default-sidebar {
        height: 100vh;
        max-height: calc(100vh - 64px);
        background-color: #FFF;
        top: 64px;
        width: 275px;
        border-right: 1px solid #F2F2F2;
        padding-right: 0;
        padding-left: 0;
        > dl {
            > dt {
                padding: 2px 16px;
                color: #00000073;
                line-height: 1.5715;
                font-size: 13px;
                margin: 2px 0;
            }
            > dd {
                height: 40px;
                line-height: 40px;
                font-size: $sidebar-font-size;
                margin: 4px;
                box-sizing: content-box;
                padding: 0;
                > a {
                    font-size: inherit;
                    line-height: inherit;
                    padding: 0 12px;
                    margin: 0;
                    border-radius: 8px;
                    color: $basic-black-color;
                    &:hover {
                        background-color: rgba(0, 0, 0, 0.06);
                    }
                    &.active {
                        color: inherit;
                        background-color: #BAE0FF;
                        font-weight: normal;
                    }
                }
            }
        }
    }
}
